// import { useState } from "react";
import "./App.css";
import react from './assets/react.svg'
import App2 from "./App2.jsx";
import { useReducer } from "react";
import ToDoList from "./todolist/ToDoList.jsx";



const countReducer = (state, action) => {
  switch (action) {
    case 1:
      return state +1;
    case 0:
      return state -1;
    default:
      throw new Error()
  }
}

export default function App() {

  const imgdata = {
    src: react,
    className: '12312312',
    style: {
      width: 200,
      height: 200
    }
  }

  const [state, dispatch] = useReducer(countReducer,0)
  const addState = () => dispatch(1)
  const minState = () => dispatch(0)


  

  return (
    <>
      <div>
        Hello Word
      </div>
      <div>
        <ToDoList/>
      </div>
      <img
      alt="222"
      {...imgdata}
      />
      <div style={{padding: 10}}>
        <button onClick={addState}>+</button>
        <span>{state}</span>
        <button onClick={minState}>-</button>
      </div>
      <App2/>
    </>
  );
}
